<style scoped lang="scss">
    @import "@/styles/button.scss";
    @import "@/styles/utils.scss";
    @import "@/styles/card.scss";

    .input-row {
        margin-bottom: 20px;
        padding-left: 10px;

        .inputbox {
            input {
                height: 40px;
                width: calc(100% - 20px);
                border: none;
                padding-left: 10px;
            }
        }

    }


</style>
<template>
    <h1 style="text-align: center;">移动端登录页</h1>
    <div style="padding-left:10px;padding-right:10px;    box-sizing: border-box;">
        <div class="input-row">
            <div class="title-row">
                账号
            </div>
            <div class="inputbox">
                <input type="text" v-model="formData.username" />
            </div>
        </div>
        <div class="input-row">
            <div class="title-row">
                密码
            </div>
            <div class="inputbox" style="position:relative;">
                <input
                        v-model="formData.password"
                        :type="!seePassword?'password':'text'" />
                <div style="position: absolute;right:20px;top:12px;">
                    <svg-icon icon-class="eye-open" v-if="seePassword"
                              @click.native="()=>seePassword=!seePassword"></svg-icon>
                    <svg-icon icon-class="eye" v-else @click.native="()=>seePassword=!seePassword"></svg-icon>
                </div>
            </div>
        </div>

        <div style="padding-left:10px;padding-right:10px; box-sizing: border-box;">
            <van-button block round type="primary" @click="login" v-model:loading="loading">登录</van-button>
        </div>

    </div>
</template>
<script lang="ts" setup="props">
    import {useRouter} from "vue-router";
    import {ref} from 'vue'
    import {setCookie, setToken} from "@/utils/auth";
    import {alertFail} from "@/utils/alertUtils";

    const router = useRouter();
    const formData = ref({
        username: "",
        password: "",
    })


    const seePassword = ref(false)
    const loading = ref(false)
    let setTimeout__=undefined;

    async function login() {
        loading.value = true;

        clearTimeout(setTimeout__);
        setTimeout__=setTimeout(()=>{
            loading.value = false;
        },5*1000)
        var result = await userApi.login(
            formData.value.username,
            formData.value.password,
        )
        loading.value = false
        if (!(result && result.success)) {
            alertFail(result.message)
            return {success: false}
        }

        var logindata=result.data
        console.log(`login  data `,logindata);
        if (logindata && logindata.thirdInfo) {
            console.log('storeThirdInfo', logindata && logindata.thirdInfo)
            // store.dispatch('storeThirdInfo', result && result.thirdInfo);
            setCookie('storeThirdInfo', JSON.stringify(logindata && logindata.thirdInfo))
        }
        if (logindata && logindata.authInfo) {
            console.log('storeAuthInfo', logindata && logindata.authInfo)
            setCookie('storeAuthInfo', JSON.stringify(logindata && logindata.authInfo))
            // store.dispatch('storeAuthInfo', result && result.authInfo);
        }

        if (logindata&&logindata!.refreshToken!) {
            setCookie('refreshToken', logindata.refreshToken!);
        }

        if (logindata&&logindata.accessToken) {
            setToken(logindata&&logindata.accessToken);
            setCookie('SET_TOKEN', logindata&&logindata.accessToken);
            console.log('设置token成功,开始跳转到首页 /')
            debugger
            window.location.href = "/"

        }

    }
</script>
